import { Card } from "antd";
import "../../../common/common.css";

export const PanelObjectData = [
    {
        key: "1",
        label: "对象合并",
        children: (
            <div className="centerTextLeft lodashPanel lodashWidth">
                <Card title="assign" className="lodashCard">
                    <p>
                        _.assign(object, [sources]) <br />
                        <b>【 合并对象，会改变object，通过Object.prototype.key = value添加的属性不会合并 】</b>
                    </p>
                    <p>分配来源对象的可枚举属性到目标对象上。 来源对象的应用规则是从左到右，随后的下一个对象的属性会覆盖上一个对象的属性。 注意: 这方法会改变 object，参考自Object.assign.</p>
                    <p>返回object</p>
                </Card>
                <Card title="assignIn" className="lodashCard">
                    <p>
                        _.assignIn(object, [sources]) <br />
                        <b>【 合并对象，会改变object，通过Object.prototype.key = value添加的属性也会合并 】</b>
                    </p>
                    <p>这个方法类似_.assign， 除了它会遍历并继承来源对象的属性。 Note: 这方法会改变 object。</p>
                    <p>返回object</p>
                </Card>
                <Card title="assignInWith & assignWith" className="lodashCard">
                    <p>
                        _.assignInWith(object, sources, [customizer]) <br />
                        _.assignWith(object, sources, [customizer]) <br />
                        <b>【 自定义对象属性合并规则(区别没理解) 】</b>
                    </p>
                    <p>返回object</p>
                </Card>
                <Card title="defaults" className="lodashCard">
                    <p>
                        _.defaults(object, [sources]) <br />
                        <b>【 合并对象，同属性先出现先生效 】</b>
                    </p>
                    <p>分配来源对象的可枚举属性到目标对象所有解析为 undefined 的属性上。 来源对象从左到右应用。 一旦设置了相同属性的值，后续的将被忽略掉。 注意: 这方法会改变 object.</p>
                    <p>返回object</p>
                </Card>
                <Card title="defaultsDeep" className="lodashCard">
                    <p>
                        _.defaultsDeep(object, [sources]) <br />
                        <b>【 合并对象，同属性先出现先生效，可以递归多层嵌套 】</b>
                    </p>
                    <p>这个方法类似_.defaults，除了它会递归分配默认属性。注意: 这方法会改变 object.</p>
                    <p>返回object</p>
                </Card>
                <Card title="merge" className="lodashCard">
                    <p>
                        _.merge(object, [sources]) <br />
                        <b>【 合并对象，数组相同下标进行合并 】</b>
                    </p>
                    <p>
                        该方法类似_.assign， 除了它递归合并 sources 来源对象自身和继承的可枚举属性到 object 目标对象。如果目标值存在，被解析为undefined的sources
                        来源对象属性将被跳过。数组和普通对象会递归合并，其他对象和值会被直接分配覆盖。源对象从从左到右分配。后续的来源对象属性会覆盖之前分配的属性。Note: 这方法会改变对象 object.
                    </p>
                    <p>返回object</p>
                </Card>
                <Card title="mergeWith" className="lodashCard">
                    <p>
                        _.mergeWith(object, sources, customizer) <br />
                        <b>【 类似merge，不同之处是相同key下的数组都会合并 】</b>
                    </p>
                    <p>
                        该方法类似_.merge，除了它接受一个 customizer，调用以产生目标对象和来源对象属性的合并值。如果customizer 返回 undefined，将会由合并处理方法代替。customizer调用与7个参数：(objValue, srcValue, key, object, source,
                        stack)。Note: 这方法会改变对象 object.
                    </p>
                    <p>返回object</p>
                </Card>
            </div>
        ),
    },
    {
        key: "3",
        label: "返回对象指定路径value/检查对象是否有指定属性",
        children: (
            <div className="centerTextLeft lodashPanel lodashWidth">
                <Card title="at" className="lodashCard">
                    <p>
                        _.at(object, [paths]) <br />
                        <b>【 获取一系列指定路径key的value 】</b>
                    </p>
                    <p>创建一个数组，值来自 object 的paths路径相应的值。</p>
                    <p>返回array</p>
                </Card>
                <Card title="get" className="lodashCard">
                    <p>
                        _.get(object, path, [defaultValue]) <br />
                        <b>【 解析对象是否存在指定路径，存在返回value，不存在返回defaultValue 】</b>
                    </p>
                    <p>根据 object对象的path路径获取值。 如果解析 value 是 undefined 会以 defaultValue 取代。</p>
                    <p>返回处理后的值</p>
                </Card>
                <Card title="has" className="lodashCard">
                    <p>
                        _.has(object, path) <br />
                        <b>【 检查对象是否有指定属性 】</b>
                    </p>
                    <p>检查 path 是否是object对象的直接属性。</p>
                    <p>返回boolean值</p>
                </Card>
                <Card title="hasIn" className="lodashCard">
                    <p>
                        _.hasIn(object, path) <br />
                        <b>【 检查对象是否有指定属性 】</b>
                    </p>
                    <p>检查 path 是否是object对象的直接或继承属性。</p>
                    <p>返回boolean值</p>
                </Card>
                <Card title="pick" className="lodashCard">
                    <p>
                        _.pick(object, [props]) <br />
                        <b>【 从对象中挑选指定key返回组成新对象 】</b>
                    </p>
                    <p>创建一个从 object 中选中的属性的对象。</p>
                    <p>返回新的object</p>
                </Card>
                <Card title="pickBy" className="lodashCard">
                    <p>
                        _.pickBy(object, [predicate=_.identity]) <br />
                        <b>【 对对象每个属性进行处理，然后挑选指定key返回组成新对象 】</b>
                    </p>
                    <p>创建一个对象，这个对象组成为从 object 中经 predicate 判断为真值的属性。 predicate调用2个参数：(value, key)。</p>
                    <p>返回新的object</p>
                </Card>
            </div>
        ),
    },
    {
        key: "5",
        label: "遍历对象",
        children: (
            <div className="centerTextLeft lodashPanel lodashWidth">
                <Card title="forIn" className="lodashCard">
                    <p>
                        _.forIn(object, [iteratee=_.identity]) <br />
                        <b>【 遍历对象进行处理 】</b>
                    </p>
                    <p>使用 iteratee 遍历对象的自身和继承的可枚举属性。 iteratee 会传入3个参数：(value, key, object)。 如果返回 false，iteratee 会提前退出遍历。</p>
                    <p>返回object</p>
                </Card>
                <Card title="forInRight" className="lodashCard">
                    <p>
                        _.forInRight(object, [iteratee=_.identity]) <br />
                        <b>【 从末尾反方向遍历对象进行处理 】</b>
                    </p>
                    <p>这个方法类似_.forIn。 除了它是反方向开始遍历object的。</p>
                    <p>返回object</p>
                </Card>
                <Card title="forOwn" className="lodashCard">
                    <p>
                        _.forOwn(object, [iteratee=_.identity]) <br />
                        <b>【 遍历对象进行处理，通过Object.prototype.key = value添加的属性不会处理 】</b>
                    </p>
                    <p>使用 iteratee 遍历自身的可枚举属性。 iteratee 会传入3个参数：(value, key, object)。 如果返回 false，iteratee 会提前退出遍历。</p>
                    <p>返回object</p>
                </Card>
                <Card title="forOwnRight" className="lodashCard">
                    <p>
                        _.forOwnRight(object, [iteratee=_.identity]) <br />
                        <b>【 从末尾反方向遍历对象进行处理，通过Object.prototype.key = value添加的属性不会处理 】</b>
                    </p>
                    <p>这个方法类似_.forOwn。 除了它是反方向开始遍历object的。</p>
                    <p>返回object</p>
                </Card>
                <Card title="functions" className="lodashCard">
                    <p>
                        _.functions(object) <br />
                        <b>【 将对象所有key生成一个数组，通过Object.prototype.key = value添加的属性不会处理 】</b>
                    </p>
                    <p>创建一个函数属性名称的数组，函数属性名称来自object对象自身可枚举属性。</p>
                    <p>返回array</p>
                </Card>
                <Card title="functionsIn" className="lodashCard">
                    <p>
                        _.functionsIn(object) <br />
                        <b>【 将对象所有key生成一个数组，通过Object.prototype.key = value添加的属性会进行处理 】</b>
                    </p>
                    <p>创建一个函数属性名称的数组，函数属性名称来自object对象自身和继承的可枚举属性。</p>
                    <p>返回array</p>
                </Card>
                <Card title="mapKeys" className="lodashCard">
                    <p>
                        .mapKeys(object, [iteratee=_.identity]) <br />
                        <b>【 对对象遍历修改属性名，保留value 】</b>
                    </p>
                    <p>反向版_.mapValues。 这个方法创建一个对象，对象的值与object相同，并且 key 是通过 iteratee 运行 object 中每个自身可枚举属性名字符串 产生的。iteratee调用三个参数： (value, key, object)。</p>
                    <p>返回新的object</p>
                </Card>
                <Card title="mapValues" className="lodashCard">
                    <p>
                        _.mapValues(object, [iteratee=_.identity]) <br />
                        <b>【 对对象遍历修改value，保留key 】</b>
                    </p>
                    <p>创建一个对象，这个对象的key与object对象相同，值是通过 iteratee 运行 object 中每个自身可枚举属性名字符串产生的。 iteratee调用三个参数： (value, key, object)。</p>
                    <p>返回新的object</p>
                </Card>
            </div>
        ),
    },
    {
        key: "7",
        label: "对指定路径属性进行处理（进行操作、删除、设置）",
        children: (
            <div className="centerTextLeft lodashPanel lodashWidth">
                <h3>进行操作</h3>
                <div className="lodashPanel">
                    <Card title="invoke" className="lodashCard">
                        <p>
                            _.invoke(object, path, [args]) <br />
                            <b>【 对对象指定路径属性进行处理，返回结果 】</b>
                        </p>
                        <p>调用object对象path上的方法。</p>
                        <p>返回调用方法的结果。</p>
                    </Card>
                    <Card title="update" className="lodashCard">
                        <p>
                            _.update(object, path, updater) <br />
                            <b>【 对对象指定路径属性进行参数处理返回对象 】</b>
                        </p>
                        <p>该方法类似_.set，除了接受updater以生成要设置的值。使用_.updateWith来自定义生成的新path。updater调用1个参数：(value)。Note: 这个方法会改变 object。</p>
                        <p>返回object</p>
                    </Card>
                </div>
                <h3>进行删除</h3>
                <div className="lodashPanel">
                    <Card title="omit" className="lodashCard">
                        <p>
                            _.omit(object, [props]) <br />
                            <b>【 删除指定属性后返回新对象 】</b>
                        </p>
                        <p>反向版_.pick; 这个方法一个对象，这个对象由忽略属性之外的object自身和继承的可枚举属性组成。（注：可以理解为删除object对象的属性）。</p>
                        <p>返回新的object</p>
                    </Card>
                    <Card title="omitBy" className="lodashCard">
                        <p>
                            _.omitBy(object, [predicate=_.identity]) <br />
                            <b>【 对对象value进行处理，返回为true的删除 】</b>
                        </p>
                        <p>反向版_.pickBy;这个方法一个对象，这个对象忽略 predicate（断言函数）判断不是真值的属性后，object自身和继承的可枚举属性组成。predicate调用与2个参数：(value, key)。</p>
                        <p>返回新的object</p>
                    </Card>
                    <Card title="unset" className="lodashCard">
                        <p>
                            _.unset(object, path) <br />
                            <b>【 删除对象上指定属性 】</b>
                        </p>
                        <p>移除object对象 path 路径上的属性。注意: 这个方法会改变源对象 object。</p>
                        <p>返回boolean值</p>
                    </Card>
                </div>
                <h3>进行设置</h3>
                <div className="lodashPanel">
                    <Card title="set" className="lodashCard">
                        <p>
                            _.set(object, path, value) <br />
                            <b>【 设置对象属性路径上值，不存在则创建 】</b>
                        </p>
                        <p>设置 object对象中对应 path 属性路径上的值，如果path不存在，则创建。 缺少的索引属性会创建为数组，而缺少的属性会创建为对象。 使用_.setWith 定制path创建。Note: 这个方法会改变 object。</p>
                        <p>返回object</p>
                    </Card>
                    <Card title="setWith" className="lodashCard">
                        <p>
                            _.setWith(object, path, value, [customizer]) <br />
                            <b>【 对对象路径修改值(参数4未理解) 】</b>
                        </p>
                        <p>这个方法类似_.set，除了它接受一个 customizer，调用生成对象的 path。 如果 customizer 返回 undefined 将会有它的处理方法代替。 customizer 调用3个参数： (nsValue, key, nsObject)。注意: 这个方法会改变 object.</p>
                        <p>返回object</p>
                    </Card>
                </div>
            </div>
        ),
    },
    {
        key: "8",
        label: "返回对象属性/值数组",
        children: (
            <div className="centerTextLeft lodashPanel lodashWidth">
                <Card title="keys" className="lodashCard">
                    <p>
                        _.keys(object) <br />
                        <b>【 返回对象的属性数组，不包含object.prototype.key 】</b>
                    </p>
                    <p>创建一个 object 的自身可枚举属性名为数组。 Note: 非对象的值会被强制转换为对象，查看ES spec 了解详情。</p>
                    <p>返回array</p>
                </Card>
                <Card title="keysIn" className="lodashCard">
                    <p>
                        _.keysIn(object) <br />
                        <b>【 返回对象的属性数组，包含object.prototype.key】</b>
                    </p>
                    <p>创建一个 object 自身 和 继承的可枚举属性名为数组。注意: 非对象的值会被强制转换为对象。</p>
                    <p>返回array</p>
                </Card>
                <Card title="values" className="lodashCard">
                    <p>
                        _.values(object) <br />
                        <b>【 将值放入数组，不包含object.prototype.key 】</b>
                    </p>
                    <p>创建 object 自身可枚举属性的值为数组。注意: 注意: 非对象的值会强制转换为对象。</p>
                    <p>返回array</p>
                </Card>
                <Card title="valuesIn" className="lodashCard">
                    <p>
                        _.valuesIn(object) <br />
                        <b>【 将值放入数组，包含object.prototype.key 】</b>
                    </p>
                    <p>创建 object 自身和继承的可枚举属性的值为数组。注意: 注意: 非对象的值会强制转换为对象。</p>
                    <p>返回array</p>
                </Card>
            </div>
        ),
    },
    {
        key: "6",
        label: "对象倒置",
        children: (
            <div className="centerTextLeft lodashPanel lodashWidth">
                <Card title="invert" className="lodashCard">
                    <p>
                        _.invert(object) <br />
                        <b>【 对象键值倒置，后面值会覆盖前面值 】</b>
                    </p>
                    <p>创建一个object键值倒置后的对象。 如果 object 有重复的值，后面的值会覆盖前面的值。</p>
                    <p>返回处理后新的object</p>
                </Card>
                <Card title="invertBy" className="lodashCard">
                    <p>
                        _.invertBy(object, [iteratee=_.identity]) <br />
                        <b>【 对象键值倒置，重复值设置为数组 】</b>
                    </p>
                    <p>这个方法类似_.invert，除了倒置对象 是 collection（集合）中的每个元素经过 iteratee（迭代函数） 处理后返回的结果。每个反转键相应反转的值是一个负责生成反转值key的数组。iteratee 会传入3个参数：(value) 。</p>
                    <p>返回处理后新的object</p>
                </Card>
            </div>
        ),
    },
    {
        key: "4",
        label: "按条件搜索key",
        children: (
            <div className="centerTextLeft lodashPanel lodashWidth">
                <Card title="findKey" className="lodashCard">
                    <p>
                        _.findKey(object, [predicate=_.identity]) <br />
                        <b>【 返回value最先被匹配到的key 】</b>
                    </p>
                    <p>这个方法类似_.find 。 除了它返回最先被 predicate 判断为真值的元素 key，而不是元素本身。</p>
                    <p>返回key</p>
                </Card>
                <Card title="findLastKey" className="lodashCard">
                    <p>
                        _.findLastKey(object, [predicate=_.identity]) <br />
                        <b>【 从末尾开始返回value最先被匹配到的key 】</b>
                    </p>
                    <p>这个方法类似_.findKey。 不过它是反方向开始遍历的。</p>
                    <p>返回key</p>
                </Card>
            </div>
        ),
    },
    {
        key: "2",
        label: "对象转二维数组",
        children: (
            <div className="centerTextLeft lodashPanel lodashWidth">
                <Card title="toPairs【entries】" className="lodashCard">
                    <p>
                        _.toPairs(object) <br />
                        <b>【 对象属性转二维数组，通过Object.prototype.key = value添加的属性不会处理 】</b>
                    </p>
                    <p>创建一个object对象自身可枚举属性的键值对数组。这个数组可以通过_.fromPairs撤回。如果object 是 map 或 set，返回其条目。</p>
                    <p>返回键值对数组</p>
                </Card>
                <Card title="toPairsIn【entriesIn】" className="lodashCard">
                    <p>
                        _.toPairsIn(object) <br />
                        <b>【 对象属性转二维数组，通过Object.prototype.key = value添加的属性可以处理 】</b>
                    </p>
                    <p>创建一个object对象自身和继承的可枚举属性的键值对数组。这个数组可以通过_.fromPairs撤回。如果object 是 map 或 set，返回其条目。</p>
                    <p>返回键值对数组</p>
                </Card>
            </div>
        ),
    },
];
